<?php

use yii\helpers\Html;
use yii\widgets\ActiveForm;
use kartik\file\FileInput;
use yii\helpers\Url;
use yii\helpers\ArrayHelper;
use kartik\markdown\MarkdownEditor;
use kartik\markdown\Markdown;

/* @var $this yii\web\View */
/* @var $model backend\modules\pooai\models\ZpooaiPages */
/* @var $form yii\widgets\ActiveForm */
?>
<style>
    .jq22 { width: 1000px; margin: 0 auto; font-family: arial,SimSun; font-size: 0;}
    .jq22 .item { display: inline-block; width: 230px;  margin: 0 20px 20px 0; background-color: #ccc;}
    .jq22 span { display: block; height: 100px; line-height: 100px; font-size: 2rem; text-align: center; color: #fff;}
</style>
<div class="zpooai-pages-form">
    <?php $form = ActiveForm::begin(); ?>

    <div class="FormPage01">
        <?= $form->field($model, 'pooai_pages_name')->textInput(['maxlength' => true]) ?>
        <?= $form->field($model, 'pooai_link')->textInput(['maxlength' => true]) ?>
    </div>

    <div class="FormPage02" style="display: none">
        <?= $form->field($ZpooaiArtical, 'title')->textInput(['maxlength' => true]) ?>
        <input name="ZpooaiArtical[zpooai_artical_id]" type="hidden" value="<?=$ZpooaiArtical->zpooai_artical_id?>" >

        <?php if($ZpooaiArtical==null) {
            echo MarkdownEditor::widget([
                'name' => 'content',
                'value' => '请编辑您的文章',
            ]);
        } else {
            echo MarkdownEditor::widget([
                'model' => $ZpooaiArtical,
                'attribute' => 'content',
            ]);
        }?>

    </div>

    <div class="FormPage03" style="display: none">
        <input name="pooai_pages_id" type="hidden" id="pooai_pages_id" value="" />

        <?php
            $initialPreview =  array();
            $initialPreviewConfig = array();
            foreach($ZpooaiGallImages as $k=>$v) {
                $initialPreview[] = "<img width='100%' height='100%' src='" .  '../' . $v['zpooai_image'] . "' class='file-preview-image'>";
                $initialPreviewConfig[] = [
                    'caption' => $v['zpooai_image'],
                    'url' => Url::to(['/pooai/zpooaigallimages/delete', 'id' => $v['pooai_gall_images_id']]),
                ];
            }
        ?>
        <?=$form->field($model, 'images[]')->label(Yii::t('catalog','Image(请先上传图片)'))->widget(FileInput::classname(), [
            'language' => 'zh',
            'options' => [ 'accept' => 'image/*', 'multiple'=>true],
            'pluginOptions' => [
                'initialPreview'=>$initialPreview,
                'initialPreviewConfig'=>$initialPreviewConfig,
                'overwriteInitial'=>false,
                'uploadUrl' => Url::to(['/pooai/zpooaipages/upload']),
                'uploadExtraData' => [
                    'pooai_pages_id' => $model->pooai_pages_id,
                    'position' => 5//TODO:  js
                ],
                'dropZoneEnabled'=>true,
                'maxFileCount' => 10,
                'allowedFileExtensions'=>['jpg','gif','png']
            ]
        ]);?>
        <h4>拖动图片排序</h4>
        <div class="jq22">
            <?php foreach($ZpooaiGallImages as $k=>$v) {
                $sort = $k+1;
                echo  '<div id="'.$v['pooai_gall_images_id'].'" class="item item'.$sort.'">'.
                            "<img width='100%'  src='" .  '../' . $v['zpooai_image'] . "' class='file-preview-image'>".
                        '</div>';
            }?>
        </div>
        <script>
            $(function(){
                $('.jq22').dad();
            });
        </script>
    </div>
    <div class="form-group">
        <?= Html::submitButton($model->isNewRecord ? Yii::t('app', 'Create') : Yii::t('app', 'Update'), ['class' => $model->isNewRecord ? 'btn btn-success' : 'btn btn-primary']) ?>
    </div>

    <?php ActiveForm::end(); ?>
</div>
